import 'package:flutter/material.dart';
import './component/navigation_bar.dart';
import './detail.dart';

class Home extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: "Flutter_Tech",
      theme: ThemeData(primaryColor: Colors.blue),
      debugShowCheckedModeBanner: false,
      home: MyHomePage(title: "Flutter"),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final List datas = [
    {"title": 'App Demo', "type": 'flutter_page'},
    {"title": '页面跳转', "type": 'PageJump'},
    {"title": '数据存储', "type": 'DataStoreage'},
    {"title": '网络请求', "type": 'NetworkRequest'},
    {"title": '图片加载', "type": 'ImageLoad'},
    {"title": '动画', "type": 'animation'}
  ];

  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  bool tapDown = false;
  // int _counter = 0;

  // void _incrementCounter(){
  //   setState(() {
  //     _counter++;
  //   });
  // }

  getItem(model) => HomeCell(model: model);

  Widget build(BuildContext context) {
    return Scaffold(
        appBar: NavigationBar(
            child: AppBar(
              title: Text(widget.title),
              elevation: 0,
            ),
        ),
        body: ListView.builder(
          itemCount: widget.datas.length,
          itemBuilder: (BuildContext context, int index) {
            return getItem(widget.datas[index]);
          },
        ));
  }
}

class HomeCell extends StatefulWidget {
  HomeCell({Key key, this.model}) : super(key: key);

  final Map model;

  @override
  _HomeCellState createState() => _HomeCellState();
}

class _HomeCellState extends State<HomeCell> {
  bool hightLight = false;

  void _onTapDown(TapDownDetails details) {
    setState(() {
      hightLight = true;
    });
  }

  void _onTapUp(TapUpDetails details) {
    setState(() {
      hightLight = false;
    });
  }

  void _onTapCancel() {
    setState(() {
      hightLight = false;
    });
  }

  Widget build(BuildContext context) {
    return GestureDetector(
        onTap: () {
          Navigator.push(context,
              MaterialPageRoute(builder: (BuildContext context) {
            return DetailPage();
          }));
        },
        onTapDown: _onTapDown,
        onTapUp: _onTapUp,
        onTapCancel: _onTapCancel,
        child: Container(
          padding: EdgeInsets.only(left: 15),
          decoration: BoxDecoration(
              border: Border(
                  bottom: BorderSide(
                color: Color.fromARGB(255, 0x9d, 0x9d, 0x9d),
                width: 0.5,
              )),
              color: hightLight ? Colors.grey : null),
          height: 60,
          child: Row(
            children: <Widget>[
              Container(
                width: MediaQuery.of(context).size.width - 100,
                child: Text(widget.model["title"],
                    style: TextStyle(fontSize: 18),
                    softWrap: false,
                    overflow: TextOverflow.ellipsis),
              )
            ],
          ),
        ));
  }
}
